import 'package:flutter/material.dart';
import 'package:hockey/extensions/jzx_widget_extension.dart';
import 'package:hockey/jzx_apps.dart';
import 'package:hockey/models/jzx_cdt_item.dart';
import 'package:hockey/pages/jzx_avatar_unlock_condition/jzx_avatar_unlock_condition.dart';
import 'package:hockey/pages/jzx_avatar_upgrade/jzx_avatar_upgrade.dart';
import 'package:hockey/services/jzx_user.dart';

import 'controller.dart';

class JzxHomeView extends GetView<JzxHomeController> {
  const JzxHomeView({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      extendBodyBehindAppBar: true,
      appBar: const JzxAAppBar(),
      body: Column(children: [
        const _Titles(),
        Expanded(
            child: SingleChildScrollView(
          child: SizedBox(
            height: 600.w,
            child: Stack(
              children: [
                ...JzxUserService.to.frameList.reversed.map((e) {
                  return _AvatarFrame(e);
                })
              ],
            ),
          ),
        ))
      ]).backgroud(Assets.images.homeBgv),
    );
  }
}

class _AvatarFrame extends GetView<JzxHomeController> {
  const _AvatarFrame(this.item);

  final Rx<JzxCdtItem> item;

  @override
  Widget build(BuildContext context) {
    return Obx(
      () {
        final e = item.value;
        return Positioned(
          left: e.homeLeft,
          top: e.homeTop,
          child: SizedBox(
            width: 96.w + 26.w,
            height: 136.w,
            child: Stack(
              clipBehavior: Clip.none,
              children: [
                e.isUpgrade
                    ? Positioned(
                        top: -41.w,
                        left: -32.w,
                        child: e.advancedFrame.image(width: 160.w),
                      )
                    : Positioned(
                        top: 7.w,
                        left: 7.w,
                        child: e.baseFrame.image(width: 82.w),
                      ),
                if (!controller.userLevel.value.contains(e.level))
                  Positioned(
                    top: 0,
                    left: 0,
                    child: InkWell(
                      onTap: () => controller.showUnlockConditions(item),
                      child: Assets.images.icFrameMask.image(width: 96.w),
                    ),
                  ),
                if (controller.userWear.value == e.level)
                  Positioned(
                    left: 30.w,
                    top: 30.w,
                    child: Assets.images.icFrameChecked.image(width: 35.w),
                  ),
                if (controller.userLevel.value.contains(e.level) &&
                    !e.isUpgrade)
                  Positioned(
                    top: 0,
                    right: 0,
                    child: InkWell(
                      onTap: () {
                        Get.toNamed(kRouteJzxAvatarUpgrade);
                      },
                      child: Assets.images.icFrameUpdate.image(width: 26.w),
                    ),
                  ),
                Positioned(
                    left: 20.w,
                    bottom: 0,
                    child: controller.userLevel.value.contains(e.level)
                        ? InkWell(
                            onTap: () {
                              controller.applyWear(e.level);
                            },
                            child: Opacity(
                                opacity: controller.userWear.value == e.level
                                    ? 0.7
                                    : 1,
                                child: Assets.images.icFrameApply
                                    .image(width: 56.w)),
                          )
                        : e.levelIcon.image(width: 56.w)
                    // : Assets.images.icLevel5.image(width: 56.w),
                    ),
              ],
            ),
          ),
        );
      },
    );
  }
}

class _Titles extends StatelessWidget {
  const _Titles();

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: EdgeInsets.only(
        top: kStatusBarHeight + 21.w,
        left: 20.w,
        right: 20.w,
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Row(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Assets.images.icHomeTitle.image(width: 193.w),
              JzxGaps.expand,
              InkWell(
                  onTap: () {
                    Get.toNamed(kRouteJzxAvatarUpgrade);
                  },
                  child: Assets.images.icHomtTop.image(width: 36.w)),
            ],
          ),
          JzxGaps.h2,
          InkWell(
              onTap: () {
                Get.toNamed(kRouteJzxAvatarUnlockCondition);
              },
              child: Assets.images.icHomeTips.image(width: 253.w)),
        ],
      ),
    );
  }
}
